<!-- StudyCreatPlan_Frame.html -->
<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<meta http-equiv="X-UA-Compatible" content="IE=edge">
		<meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
		<meta name="format-detection" content="telephone=no, email=no, date=no, address=no">
		<title>创建学习计划</title>
		<link rel="stylesheet" type="text/css" href="../../css/api.css" />
		<link rel="stylesheet" href="../../css/weui.min.css">
		<link rel="stylesheet" href="../../css/jquery-weui.min.css">
		<link rel="stylesheet" href="../../css/mui.min.css"/>
		<link rel="stylesheet" href="../../css/CFNetPP_Base.css">
		<style type="text/css">
			.base_right_item{
				text-align: center;
				font-size: 14px;
			}
			.plan-table-view{
				background-color: #f3f5f7;
			}
			.plan-cell{
				background-color: white;
				margin-bottom: 8px;
			}
			.plan-cell .cell-p{
				margin: 0;
				font-size: 14px;
				line-height: 30px;
				color: #333;
			}
			.plan-cell .cell-left-div{
				width: 100px;
				height: 30px;
				float: left;
			}
			.plan-cell .cell-right-div{
				margin-left: 100px;
				height: 30px;
			}
			input[type=text]{
				border: none;
				margin: 0;
				padding: 0;
				height: 30px;
				font-size: 14px;
				color: #333;
			}
			.time-input{
				font-size: 14px;
				line-height: 30px;
				height: 30px;
				color: #333;
			}
			.bottom-div{
				position: absolute;
				left: 0;
				bottom: 0;
				height: 50px;
				width: 100%;
				text-align: center;
			}
			.hide-class{
				display: none;
			}
			.btn-normal{
				background-color: #18b4ed;
			}
			.btn-disabled{
				background-color: #a9a9a9;
			}
			.bottom-div-p{
				line-height: 50px;
				color: white;
				margin: 0;
			}
		</style>
	</head>
	<body onclick="onBodyClick();">
		<ul class="mui-table-view plan-table-view">
			<li class="mui-table-view-cell plan-cell">
				<input id="plan_name" class="cell-input" type="text" placeholder="请输入计划名称">
			</li>
			<li class="mui-table-view-cell plan-cell">
				<a class="mui-navigate-right">
					<div class="cell-left-div">
						<p class="cell-p">
							开始时间:
						</p>
					</div>
					<div class="cell-right-div">
						<input id='plan_start_time' class="weui_input time-input"></input>
					</div>
				</a>
			</li>
			<li class="mui-table-view-cell plan-cell">
				<a class="mui-navigate-right">
					<div class="cell-left-div">
						<p class="cell-p">
							结束时间:
						</p>
					</div>
					<div class="cell-right-div">
						<input id='plan_end_time' class="weui_input time-input"></input>
					</div>
				</a>
			</li>
			<!-- <li class="mui-table-view-cell plan-cell" onclick="onSelectCourseClick()">
				<a class="mui-navigate-right">
					<div class="cell-left-div">
						<p class="cell-p">
							选择课程
						</p>
					</div>
					<div class="cell-right-div">
						<p class="cell-p">
							已选<span id="course_num">0</span>门课程
						</p>
					</div>
				</a>
			</li>
			<li class="mui-table-view-cell plan-cell" onclick="onSelectTeamClick()">
				<a class="mui-navigate-right">
					<div class="cell-left-div">
						<p class="cell-p">
							添加小组
						</p>
					</div>
					<div class="cell-right-div">
						<p class="cell-p">
							已添加<span id="team_num">0</span>个小组
						</p>
					</div>
				</a>
			</li> -->
		</ul>
		<div id="bottom_div" class="bottom-div hide-class btn-normal" onclick="onSaveClick();">
			<p class="bottom-div-p">
				下一步
			</p>
		</div>
		<div id="edit_save_div" class="bottom-div hide-class btn-disabled" onclick="onEditSaveClick();">
			<p class="bottom-div-p">
				保存
			</p>
		</div>
	</body>
	<script type="text/javascript" src="../../script/jquery.min.js"></script>
	<script type="text/javascript" src="../../script/jquery-weui.min.js"></script>
	<script type="text/javascript" src="../../script/api.js"></script>
	<script type="text/javascript" src="../../script/MD5.js"></script>
	<script type="text/javascript" src="../../script/requestTool.js"></script>
	<script type="text/javascript" src="../../script/timeStampTool.js"></script>
	<script type="text/javascript">
		var currentPlanId = "0";
		var currenttype = 'creat';//默认为创建
		var currentPageParam = new Object();
		var currentTitle = '';
		var currentBtime = '';
		var currentEtime = '';
		apiready = function() {
			setupPageType();
			setupClick();
			setupNotifi();
			setupPlanNameInput();
			sendBuriedNotifi('0', '添加学习计划基本信息页', '216')
		}
	    //发送埋点通知
		function sendBuriedNotifi(busionessid, pagetype, pagetypeid) {
			var userinfo = {
				uid : $api.getStorage('cfnetppuid'),
				jid : $api.getStorage('cfnetppjxid'),
				uname : $api.getStorage('cfnetppusername'),
			}
			var data = {
				busionessid : busionessid,
				pagetype : pagetype,
				pagetypeid : pagetypeid,
				sourceurl : api.pageParam.sourceurl,
				sourcetitle : api.pageParam.sourcetitle,
				accesspageurl : window.location.pathname,
				accesspagetitle : document.title,
				userinfo : userinfo
			}
			SendBehaviorTrajectoriesNotifi_Study(data);
		}
		//设置输入框长度限制
		function setupPlanNameInput(){
			$('#plan_name').bind('input propertychange', function() {  
	            var currentName = $('#plan_name').val();
	            if (currentName.length > 30) {
	                currentName = currentName.slice(0,30);
	                $('#plan_name').val(currentName);
	                api.toast({
	                    msg: '学习计划名称最长30字'
	                });
	            }
	        });
		}
		function setupNotifi(){
			api.addEventListener({
			    name: 'studyPlanEditFinishNotifi'
			}, function(ret, err) {
				if (isChanged()) {
					editPlan(function(){
				    	setupFinish();
				    });
				}else{
					setupFinish();
				}
			});
			//绑定input改变事件
			$("#plan_name").bind('input porpertychange',function(){
				setupEditBtn();
			});
		}
		function setupEditBtn(){
			if (isChanged()) {
				$('#edit_save_div').removeClass('btn-disabled');
				$('#edit_save_div').addClass('btn-normal');
			}else{
				$('#edit_save_div').addClass('btn-disabled');
				$('#edit_save_div').removeClass('btn-normal');
			}
		}
		//完成事件
		function setupFinish(){
			api.sendEvent({
			    name: 'refreshTeacherCourseListNotifi'
			});
			api.closeToWin({
			    name: 'Teacher_NewCourseListWin'
			});
		}
		//设置页面类型：编辑/创建
		function setupPageType(){
			currenttype = api.pageParam.planType;
			if (currenttype == 'edit') {//编辑模式
				setupEditUI();
				loadPlanDetail();
			}else{
				setupCreatUI();
			}
		}
		//设置新建模式UI
		function setupCreatUI(){
			$('#bottom_div').show();
			$('#edit_save_div').hide();
		}
		//设置编辑模式下的页面UI
		function setupEditUI(){
			$('#bottom_div').hide();
			$('#edit_save_div').show();
		}
		//加载计划详情（用于编辑模式）
		function loadPlanDetail(){
			//显示加载窗
			api.showProgress({
			    style: 'default',
			    animationType: 'fade',
			    title: '',
			    text: '加载学习计划数据中',
			    modal: false
			});
			//请求参数
			var params = {
				id : api.pageParam.id,//计划id
				jid : $api.getStorage('cfnetppjxid'),
				uid : $api.getStorage('cfnetppuid')
			};
			cfnetppPOST(url_getPlanDetail, params, true, function(data, status){
				api.hideProgress();
				if(status = 'success'){
					if (data.code == 200) {
						var planData = data.data;
						setupPlanData(planData);
						return;
					}
				}
				//如果加载失败则设置列表数据（不传设置列表传过来的数据）
				setupPlanData();
			});
		}
		//设置计划数据
		function setupPlanData(planData){
			currentPageParam = api.pageParam;
			currentPlanId = currentPageParam.id;
			if (planData != null) {
				currentTitle = planData.title;
				currentBtime = planData.btime;
				currentEtime = planData.etime;
			}else{
				currentTitle = currentPageParam.title;
				currentBtime = currentPageParam.btime;
				currentEtime = currentPageParam.etime;
			}
			var btime = timeWithStamp3(currentBtime);
			var etime = timeWithStamp3(currentEtime);
			$('#plan_name').val(currentTitle);
			$('#plan_start_time').val(btime);
			$('#plan_end_time').val(etime);
		}
		//设置时间控件点击弹出
		function setupClick(){
			$('#plan_start_time').datetimePicker();
			$('#plan_end_time').datetimePicker();
			startTimeValueChange();
		}
		function startTimeValueChange(){
			$('#plan_start_time').click(function() {  
				setTimeout(function(){
					setupFinishBtn();
				}, 1000);
			}); 
		}
		function setupFinishBtn(){
			$('.picker-button').unbind('click');
			$('.picker-button').click(function(){
				var plan_start_time = $('#plan_start_time').val();
				var plan_end_time = $('#plan_end_time').val();
				if (plan_end_time == '') {//还未设置结束时间
					plan_start_time = plan_start_time.replace(new RegExp(/-/gm) ,"/");
					var btime = Date.parse(new Date(plan_start_time))/1000;
					var etime = btime + 30 * 24 * 60 * 60;//加30天
					var etimeString = timeWithStamp3(etime.toString());
					$('#plan_end_time').val(etimeString);
				}
			});
		}
		function onBodyClick(){
			$('.picker-button').unbind('click');
			$('.picker-button').click(function() {
				setupEditBtn();
			});
		}
		function backClick() {
			api.closeWin();
		}
		function savePlan(callback){
			var title = $('#plan_name').val();
			if (title == '' || title == null) {
				api.toast({
				    msg: '请输入计划名称'
				});
				return;
			}
			var plan_start_time = $('#plan_start_time').val();
			plan_start_time = plan_start_time.replace(new RegExp(/-/gm) ,"/");
			if (plan_start_time == '' || plan_start_time == null) {
				api.toast({
				    msg: '请选择计划开始时间'
				});
				return;
			}
			var plan_end_time = $('#plan_end_time').val();
			plan_end_time = plan_end_time.replace(new RegExp(/-/gm) ,"/");
			if (plan_end_time == '' || plan_end_time == null) {
				api.toast({
				    msg: '请选择计划结束时间'
				});
				return;
			}
			var btime = Date.parse(new Date(plan_start_time))/1000;
			var etime = Date.parse(new Date(plan_end_time))/1000;
			if (etime < btime) {
				api.toast({
				    msg: '结束时间不能小于开始时间'
				});
				return;
			}else if(etime == btime){
				api.toast({
				    msg: '结束时间不能与开始时间相同'
				});
				return;
			}
			var params = {
				cuid : $api.getStorage('cfnetppuid'),
				jid : $api.getStorage('cfnetppjxid'),
				title : title,
				btime : btime,
				etime : etime,
				status : 1
			};
			api.showProgress({
			    style: 'default',
			    animationType: 'fade',
			    title: '',
			    text: '创建学习计划中',
			    modal: false
			});
			cfnetppPOST(url_AddPlan, params, false, function(data, status){
			  SendBusinessOperationsLogNotifi('老师添加学习计划基本信息', '216', params, params, '', data, '老师添加学习计划基本信息接口', '216-01');
				api.hideProgress();
				if (status == 'success') {
					if (data.code == 200) {
						currentPlanId = data.data.id;
						saveCurrentData(params);
						api.sendEvent({
						    name: 'refreshPlanListNotifi'
						});
						callback();
					}else{
						api.toast({
						    msg: '创建学习计划失败'
						});
					}
				}else{
					api.toast({
					    msg: '创建学习计划失败,请检查您的网络!'
					});
				}
			});
		}
		//存储当前提价的信息，用以判断是否有更改
		function saveCurrentData(data){
			currentTitle = data.title;
			currentBtime = data.btime;
			currentEtime = data.etime;
		}
		//是否改变
		function isChanged(){
			var title = $('#plan_name').val();
			var plan_start_time = $('#plan_start_time').val();
			plan_start_time = plan_start_time.replace(new RegExp(/-/gm) ,"/");
			var plan_end_time = $('#plan_end_time').val();
			plan_end_time = plan_end_time.replace(new RegExp(/-/gm) ,"/");
			var btime = Date.parse(new Date(plan_start_time))/1000;
			var etime = Date.parse(new Date(plan_end_time))/1000;
			// alert('currentTitle:'+currentTitle+
			// 		'\n'+
			// 		'title:'+title+
			// 		'\n'+
			// 		'currentBtime:'+currentBtime+
			// 		'\n'+
			// 		'btime:'+btime+
			// 		'\n'+
			// 		'currentEtime:'+currentEtime+
			// 		'\n'+
			// 		'etime:'+etime
			// 	);
			if (currentTitle != title || Math.abs(parseInt(currentBtime) - btime) >= 60 || Math.abs(parseInt(currentEtime) - etime) >= 60) {
				return true;//有改变
			}else{
				return false;//无改变
			}
		}
		function onSaveClick() {
			if (currentPlanId == '0') {//没有创建计划
				savePlan(function(){
					pushToSelectCourse();
				});
			}else{
				if (isChanged()) {
					editPlan(function(){
						backClick();
					});
				}else{
					backClick();
				}
			}
		}
		function editPlan(callback){
			var title = $('#plan_name').val();
			if (title == '' || title == null) {
				api.toast({
				    msg: '请输入计划名称'
				});
				return;
			}
			var plan_start_time = $('#plan_start_time').val();
			plan_start_time = plan_start_time.replace(new RegExp(/-/gm) ,"/");
			if (plan_start_time == '' || plan_start_time == null) {
				api.toast({
				    msg: '请选择计划开始时间'
				});
				return;
			}
			var plan_end_time = $('#plan_end_time').val();
			plan_end_time = plan_end_time.replace(new RegExp(/-/gm) ,"/");
			if (plan_end_time == '' || plan_end_time == null) {
				api.toast({
				    msg: '请选择计划结束时间'
				});
				return;
			}
			var btime = Date.parse(new Date(plan_start_time))/1000;
			var etime = Date.parse(new Date(plan_end_time))/1000;
			if (etime < btime) {
				api.toast({
				    msg: '结束时间不能小于开始时间'
				});
				return;
			}else if(etime == btime){
				api.toast({
				    msg: '结束时间不能与开始时间相同'
				});
				return;
			}
			var params = {
				id : currentPlanId,
				uid : $api.getStorage('cfnetppuid'),
				jid : $api.getStorage('cfnetppjxid'),
				title : title,
				btime : btime,
				etime : etime,
				status : 1
				// status : api.pageParam.status
			};
			api.showProgress({
			    style: 'default',
			    animationType: 'fade',
			    title: '',
			    text: '修改学习计划中',
			    modal: false
			});
			cfnetppPOST(url_editPlan, params, false, function(data, status){
			   SendBusinessOperationsLogNotifi('老师编辑学习计划基本信息', '216', params, params, '', data, '老师编辑学习计划基本信息接口', '216-02');
				api.hideProgress();
				if (status == 'success') {
					if (data.code == 200) {
						api.toast({
						    msg: '修改学习计划成功'
						});
						// api.sendEvent({
						//     name: 'refreshPlanListNotifi'
						// });
						callback();
					}else{
						api.toast({
						    msg: '修改学习计划失败'
						});
					}
				}else{
					api.toast({
					    msg: '修改学习计划失败'
					});
				}
			});
		}
		function pushToSelectCourse(){
		    sendBuriedNotifi('1', '添加学习计划基本信息页', '216')
			api.openWin({useWKWebView:true,
			    name: 'StudyPlanAddCourse_Win',
			    url: 'StudyPlanAddCourse_Win.html',
			    pageParam: {
			    	pid : currentPlanId,
			    	sourceurl : window.location.pathname,
					sourcetitle : document.title
			    }
			});
		}
		function pushToTeamList(){
		    sendBuriedNotifi('1', '添加学习计划基本信息页', '216')
			api.openWin({useWKWebView:true,
			    name: 'StudyCreatTeamNew_Win',
			    url: 'StudyCreatTeamNew_Win.html',
			    pageParam: {
			    	pid : currentPlanId,
			    	sourceurl : window.location.pathname,
					sourcetitle : document.title
			    }
			});
		}
		function onSelectCourseClick() {
			if (currentPlanId == '0') {
				savePlan(function(){
					pushToSelectCourse();
				});
			}else{
				pushToSelectCourse();
			}
		}
		function onSelectTeamClick(){
			if (currentPlanId == '0') {
				savePlan(function(){
					pushToTeamList();
				});
			}else{
				pushToTeamList();
			}
		}
		//编辑状态下保存按钮
		function onEditSaveClick(){
			//如果
			if ($('#edit_save_div').hasClass('btn-disabled')) {
				return;
			}
			editPlan(function(){
				api.sendEvent({
				    name: 'refreshTeacherCourseListNotifi'
				});
				saveCurrentData({
					title : $('#plan_name').val(),
					btime : timeStampWithTimeString($('#plan_start_time').val()),
					etime :	timeStampWithTimeString($('#plan_end_time').val())
				});
				$('#edit_save_div').addClass('btn-disabled');
				$('#edit_save_div').removeClass('btn-normal');
			});
		}
	</script>
</html>